import React, { FC, useEffect, useState, CSSProperties } from 'react';
import imageHolder from '@/assets/images/defaultAvator.png';

interface IImageProps {
  style?: CSSProperties;
  src?: string;
  className?: string;
  defaultImage?: string;
}
const Image: FC<IImageProps> = (props) => {
  const [image, setImage] = useState(props.src);
  useEffect(() => {
    setImage(props.src);
  }, [props.src]);
  return (
    <img
      className={props.className}
      style={props.style}
      src={image || props.defaultImage || imageHolder}
      onError={() => {
        setImage(props.defaultImage || imageHolder);
      }}
    >
    </img>
  );
};

export default Image;
